main {
  margin-top: 200px;
  margin-left: 15%;
  margin-right: 15%;
}

main ul {
  display: flex;
  list-style: none;
  padding-left: 0px;
}

.first-row .first-row-ul1 ul {
  background-color: rgb(0, 0, 0);
  color: white;
}

.first-row-photo {
  height: 298px;
}

.first-row .first-row-ul1 ul li {
  margin: 10px .4em;
}

.first-row .first-row-ul1 li.active {
  color: rgb(192, 174, 84);
  background-color: rgb(38, 38, 38);

}

.first-row-two {
  width: 340px;
  height: 338.667px;
  background-color: rgb(36, 37, 50, 0.95);
  line-height: 1.1em;
  text-align: left;
  padding: 0 30px;
}

.first-row .first-row-ul2 ul li {
  margin: 0 .5em;
  padding-top: .7em;
  opacity: 0.7;
}

.first-row .first-row-ul2 ul li a {
  text-decoration: none;
  color: whitesmoke;
}

.first-row .first-row-ul2 ul li .active {
  border-bottom: 5px solid rgb(243, 194, 88);
  color: rgb(243, 194, 88);
}

.first-row-two .first-row-ul2 .tag {
  display: inline-block;
  border: .5px solid rgb(235, 48, 55);
  padding: 0 5px;
  color: rgb(235, 48, 55);
  font-size: 15px;
}

.first-row-ul2 ul {
  color: whitesmoke;
  opacity: 0.7;
  text-align: center;
}

.first-row-two span {
  color: white;
}

.first-row .first-row-two .p1 {
  text-align: center;
  font-size: 18px;
  background-color: rgb(65, 64, 70, 0.3);
  padding: 15px 0;
  margin: 0;
  margin-top: 10px;
  color: rgb(243, 194, 88);
}

.div3 .photo {
  height: 338.667px;
  width: 230px;
}

.second-row {
  padding-top: 50px;
  padding-bottom: 70px;
}

.second-row .photo {
  width: 270px;
  margin-left: 10px;
  box-shadow: 0 0 5px 5px rgb(110, 107, 107);
}

.third-row-box {
  background-color: rgb(11, 52, 86, 0.9);
  margin-left: 10%;
  margin-right: 12%;
  padding: 20px 0;
}

.third-row p,
.fourth-row p {
  font-size: 25px;
  color: darkorange;
}

.fourth-row a {
  text-decoration: none;
  color: darkorange;
}

.third-row ul {
  height: 90px;
}

.third-row ul li:first-child {
  margin-left: 70px;
}

.third-row ul li {
  width: 80px;
  margin-right: 20px;
  transition: width 0.5s ease-in;
  border-radius: 20px 20px;
}

.third-row ul li:last-child {
  line-height: 80px;
  color: brown;
  font-size: 30px;
}

.third-row ul li.active {
  width: 250px;
  background-repeat: no-repeat;
  margin-top: 10px;
}

.third-row ul li:nth-child(1) {
  background-image: url(../images/index-3\(1\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(1).active {
  background-image: url(../images/index-3\(1.1\).png);

}

.third-row ul li:nth-child(2) {
  background-image: url(../images/index-3\(2\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(2).active {
  background-image: url(../images/index-3\(2.2\).png);
}

.third-row ul li:nth-child(3) {
  background-image: url(../images/index-3\(3\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(3).active {
  background-image: url(../images/index-3\(3.3\).png);
}

.third-row ul li:nth-child(4) {
  background-image: url(../images/index-3\(4\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(4).active {
  background-image: url(../images/index-3\(4.4\).png);
}

.third-row ul li:nth-child(5) {
  background-image: url(../images/index-3\(5\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(5).active {
  background-image: url(../images/index-3\(5.5\).png);
}

.third-row ul li:nth-child(6) {
  background-image: url(../images/index-3\(6\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(6).active {
  background-image: url(../images/index-3\(6.6\).png);
}

.third-row ul li:nth-child(7) {
  background-image: url(../images/index-3\(7\).jpg);
  background-repeat: no-repeat;
}

.third-row ul li:nth-child(7).active {
  background-image: url(../images/index-3\(7.7\).png);
}

.fourth-row {
  margin-top: 50px;
}

.fourth-row .photo1 {
  margin-left: 10%;
}

.fourth-row .photo2 {
  margin-left: 2%;
}

.fourth-row .photo1,
.fourth-row .photo2 {
  width: 500px;
  height: 250px;
  flex: 1;
}

.fourth-row .photo3 {
  margin-top: 50px;
  margin-bottom: 50px;
}